<template>
  <div>reactive基本使用</div>
  <h1>{{ user.name }}</h1>
  <button @click="changeFn">改变数据</button>
</template>

<script lang="ts">
import { defineComponent, reactive } from "vue";

export default defineComponent({
  name: "App",

  setup() {
    console.log("setup");
    const obj = {
      name: "原obj",
      age: 18,
    };
    const user = reactive(obj);

    const changeFn = () => {
      user.name === "华为" ? (user.name = "小米") : (user.name = "华为");
      console.log(obj);
    };

    return {
      user,
      changeFn,
    };
  },
});
</script>

